<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
	<title>HU Stage</title>
	<link href="css/main.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript">
	{literal}
	var focusFields = [];
	function processInputs( id, element )
	{
		var label = $(element).find('label');
		var field = $(element).find('input');
		
		label.css( 'display', 'none' );
		
		if( field.val() == '' )
		{
			field.val( label.text() );
		}
		
		field.labelValue = label.text();
		
		if( !field.hasClass( 'focuslabel' ) && label.text() == field.val() )
		{
			field.addClass('focuslabel');
		}
					
		focusFields[ focusFields.length ] = field;
		
		field.focus( function() {
			if( label.text() == $( field ).val() )
			{
				$( field ).val('');
				field.removeClass( 'focuslabel' );
			}
		} );
		
		field.blur( function( ) {
			if( $( field ).val() == '' )
			{
				$( field ).val( label.text() );
				field.addClass( 'focuslabel' );
			}
		} );
	}
	
	$(function(){
	
		$('div.form.inputtext').each( processInputs );
		$('div.form.inputpassword').each( processInputs );
		
		$('form').each( function( id, element ) {
			$(element).submit( function(){
				$( focusFields ).each( function( id, element )
				{
					if( element.labelValue != undefined && element.labelValue == $(element).val() )
					{
						$( element ).val('');
					}
				} );
			} );
		} );
		
		$('input[type="radio"]').each( function( id, radio )
		{
			var label = $( radio ).parent().get(0);
			
			if( radio.checked )
			{
				$( label ).addClass('selected');
			}
			else
			{
				if( $( label ).hasClass( 'selected' ) )
				{
					$( label ).removeClass( 'selected' );
				}
			}
			
			$( label ).click( function()
			{
				$('input[name="' + radio.name + '"]').each( function( id, subRadio )
				{
					var subRadioLabel = $( subRadio ).parent().get(0);
					
					if( $( subRadioLabel ).hasClass( 'selected' ) )
					{
						$( subRadioLabel ).removeClass( 'selected' );
					}
				} );
				
				
				$( label ).addClass( 'selected' );
				radio.checked = true;
				
				return false;
			} );
		} );
	});
	{/literal}
	</script>
</head>
<body>

<div style="text-align: center;"></div>
<div class="hu-header">
		<img src="images/hu-logo.gif" alt="Hogeschool Utrecht" />
		<h1>Stage management</h1>
		
		<div class="menu">
			<ul>
				<li {if !$smarty.get.c}class="active"{/if}><a href="./">Begin</a></li>
				<li {if $smarty.get.c=='student'}class="active"{/if}><a href="?c=student">Studenten</a></li>
				<li {if $smarty.get.c=='docent'}class="active"{/if}><a href="?c=docent">Docenten</a></li>
				<li {if $smarty.get.c=='bedrijf'}class="active"{/if}><a href="?c=bedrijf">Bedrijven</a></li>
				<li {if $smarty.get.c=='opdracht'}class="active"{/if}><a href="?c=opdracht">Opdrachten</a></li> 
			</ul>
		</div>
	</div>
	
	<div class="content">
		{$content}
	</div>	
</body>
</html>